<template>
  <!-- 添加文件弹窗 -->
  <a-form :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }">
    <a-form-item label="模块名称">
      <a-input v-model="modalInput" placeholder="input js name" />
    </a-form-item>
    <a-form-item label="模块类型">
      <a-select
        placeholder="请选择模块类型"
        @change="handleChange($event, 'selectedValue')"
      >
        <a-select-option v-for="item in selectOptionType" :key="item">
          {{ item }}
        </a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item v-if="selectedValue == '有状态'" label="引导模板">
      <a-select
        placeholder="请选择模板类型"
        @change="handleChange($event, 'selectedTempValue')"
      >
        <a-select-option v-for="item in selectTempOptionType" :key="item">
          {{ item }}
        </a-select-option>
      </a-select>
    </a-form-item>
  </a-form>
</template>
<script>
export default {
  data() {
    return {
      modalInput: "",
      selectedChildType: "js",
      selectedValue: "",
      selectedTempValue: "",
      selectOptionType: ["无状态", "有状态"],
      selectTempOptionType: ["Demo模板", "基础模板"]
    };
  },
  methods: {
    handleChange(value, target) {
      this[target] = value;
    }
  }
};
</script>
